import React from 'react';
import {Row, Col, Button, Modal, Table} from 'antd';
import {getItems} from "../../services/dictionaryServer";
import {getDic} from "../../services/dictionaryServer";

class DicInfoModalContainer extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      tableId: null,
      cname: null,
      visible: false,
      dic: {
        id: '',
        name: '',
        comment: ''
      },
      dataSource: []
    };
  }

  initItems(dicId) {

    getDic(dicId).then(function (json) {
      if (json) {
        this.setState({
          dic: json
        });
      }
    }.bind(this));
    getItems(dicId).then(function (json) {
      if (json) {
        this.setState({
          dataSource: json
        });
      }
    }.bind(this));

  }

  handleUnBind() {

    var unBind = {
      columnName: this.state.cname,
      dicId: '',
      tableId: this.state.tableId
    }

    this.props.unBindSignal.dispatch(unBind);

    this.setState({
      tableId: null,
      cname: null,
      bindDicId: null,
      visible: false,
      clickIndex: -1,
    });
  }

  handleCancel() {
    this.setState({
      dic: {
        id: '',
        name: '',
        comment: ''
      },
      dataSource: [],
      visible: false,
    });
  }

  render() {
    const {dataSource, visible, dic} = this.state;

    const columns = [{
      title: '取值',
      key: 'value',
      dataIndex: 'value',
      width: '20%',
    }, {
      title: '名称',
      key: 'name',
      dataIndex: 'name',
      width: '20%',
    }, {
      title: '说明',
      key: 'note',
      dataIndex: 'note',
    }];

    return (
      <Modal ref="dics"
             visible={visible}
             width="720"
             title={dic.name} onCancel={this.handleCancel.bind(this)}
             footer={[
               <Button key="back" type="ghost" onClick={this.handleCancel.bind(this)}>
                 返 回</Button>,
               <Button key="submit" type="primary" style={{background: '#D9534F', border: 0}}
                       onClick={this.handleUnBind.bind(this)}>
                 取消关联
               </Button>,
             ]}
      >
        <div>
          <Row>
            <Col span={24}>{dic.comment}</Col>
          </Row>
          <Row>
            <Col span={24}>

              <Table bordered size="middle" columns={columns} pagination={{ pageSize: 20 }} scroll={{ y: 350 }}
                     dataSource={dataSource} rowKey={record => record.id}/>
            </Col>
          </Row>
        </div>
      </Modal>
    );
  }
}

export default DicInfoModalContainer;
